<template>
	<view class="button" :style="{color: color, backgroundColor: bgColor, lineHeight: lineHeight, fontSize: fontSize, 'border-radius': radius, border: border}" @click="click">{{title}}</view>
</template>
<script>
	export default {
		name: 'myButton',
		emits: ['click'],
		props:{
			title: {
				type: String,
				default: ''
			},
			color: {
				type: String,
				default: '#FF8B3E'
			},
			bgColor: {
				type: String,
				default: '#fff'
			},
			lineHeight:{
				type: String,
				default: '100rpx'
			},
			fontSize:{
				type: String,
				default: '32rpx'
			},
			radius: {
				type: String,
				default: '28rpx'
			},
			border: {
				type: String,
				default: '1px solid #FF6E05'
			}
		},
		methods:{
			click() {
				this.$emit('click')
			}
		}
	}
</script>
<style lang="scss" scoped>
	.button{
		// border-radius: 28rpx;
		border: 1px solid $uni-color-orange;
		text-align: center;
		font-weight: bold;
	}
</style>
